import React from 'react'
import {connect} from 'dva'
import {Row,Col,Button,Table,message,Modal} from 'antd'
import style from './index.css'
import AddSchool from './addModal';
import { Link } from 'dva/router'
const confirm = Modal.confirm;

class School extends React.Component{
    constructor(props) {
        super(props);
        this.state={
            visible:false,
            deleteId:'',
            dataId:'',
            data:[],
        }
    }
    //点击新增学校
    addSchool =()=>{
        this.setState({
            visible:true
        })
    }
    //点击弹框取消
    handleCancel =()=>{
        this.setState({
            visible:false
        })
        this.form.resetFields();
    }
    //点击弹框确定
    handleOk =()=>{
        const { dataId} = this.state;
        this.form.validateFields((err,values)=>{
            if(err){
                return 
            }
            console.log(values)
            if(dataId !== ''){
                this.props.dispatch({
                    type:'schoolManage/schoolUpdate',
                    payload:{
                        school:values.school,
                        rowguid:dataId,
                    }
                })
            }else{
                this.props.dispatch({
                    type:'schoolManage/addSchool',
                    payload:values
                })
            }
            this.setState({
                visible:false,
                dataId:''
            })
            this.form.resetFields();
        })
    }
    //获取弹框的dom
    saveForm =(form)=>{
        this.form = form;
    }
    //点击删除
    delete =()=>{
        const {deleteId} = this.state;
        const {dispatch} = this.props;
        confirm({
            title: '确定删除？',
            content: '请谨慎操作！',
            okText: '确定',
            cancelText: '取消',
            onOk() {
                dispatch({
                    type: 'schoolManage/schoolDelete',
                    payload: {
                        rowguid:deleteId
                    }
                });
            },
            onCancel() {
            },
        });
        
        
    }
    //点击修改
    update =(id,data)=>{
        this.setState({
            dataId:id,
            data:data,
            visible:true
        })
    }

    
    render(){
        const { schoolManage} = this.props;
        const {schoolList} = schoolManage;
        const { visible, deleteId,data} = this.state;
        console.log(visible)
        const columns = [
            {
                title:'学校名称',
                key:'1',
                dataIndex:'school',
                render: (text, record) =>
                    <Link to={`/chzu/schoolManage/department/${record.rowguid}/${record.school}`}>
                        <span className={style.title}>{record.school}</span>
                    </Link>
            },{
                title:'创建时间',
                key: '2',
                dataIndex:'cdate'
            },{
                title:'操作',
                key: '3',
                dataIndex:'key',
                render: (text,record) =>
                    <span onClick={() => { this.update(record.rowguid,record)}} className={style.span}>修改</span>
                
            }
        ];
        const rowSelection = {
            type: 'radio',
            onChange: (selectedRowKeys, selectedRows) => {
                this.setState({
                    deleteId: selectedRows[0].rowguid
                })
            },
            getCheckboxProps: record => ({
                disabled: record.name === 'Disabled User',
                name: record.name,
            }),
        };
        return (
            <div className={style.content}>
                <Row>
                    <Col span={15} className={style.col}>
                        <span className={style.icon}>学校列表</span>
                    </Col>
                    <Col span={3} className={style.col}>
                    </Col>
                    <Col span={3} className={style.col}>
                        <Button className={style.Button} type="primary" onClick={this.addSchool}>新增学校</Button>
                    </Col>
                    <Col span={3} className={style.col}>
                        <Button className={style.Button} onClick={this.delete}>删除</Button>
                    </Col>
                </Row>
                <Row>
                    <Table 
                        rowKey="id" 
                        rowSelection={rowSelection} 
                        columns={columns} 
                        dataSource={schoolList} />
                </Row>
                <AddSchool
                    ref={this.saveForm}
                    visible={visible}
                    data={data}
                    onOk={this.handleOk}
                    onCancel={this.handleCancel}
                />
            </div>
        )
    }
}
export default connect(({ schoolManage }) => ({ schoolManage}))(School)